<template>
	<view style="padding-top: 100rpx;">
		<view class="text-area">
			<text>输入值:</text>
			<input type="text" v-model="title"
				style="color: red; border: 1px solid #eee; padding: 10rpx; margin-left: 20rpx;" />
		</view>
		<view class="text-area" style="margin-top: 30rpx;">
			<text>回传值:</text>
			<input type="text" :value="callBackValue"
				style="color: blue; border: 1px solid #eee; padding: 10rpx; margin-left: 20rpx;" />
		</view>
		<comA :intent="title" style="margin-top: 50rpx;" />
		<comB @callBackFun="callBack" style="margin-top: 30rpx;" />
	</view>
</template>

<script>
	import comA from '/components/compA.vue'
	import comB from '/components/compB.vue'

	export default {
		components: {
			comA,
			comB
		},
		data() {
			return {
				title: '',
				callBackValue: ''
			}
		},
		methods: {
			callBack(msg) {
				console.warn("---父组件接收子组件B回传值-->", msg);
				this.callBackValue = msg;
			}
		}
	}
</script>

<style scoped>
	.text-area {
		display: flex;
		align-items: center;
		margin-left: 30rpx;
	}
</style>